<!DOCTYPE html>
<html lang="zh_CN" xmlns:th="http://www.thymeleaf.org"
      xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout">
<head>
    <title th:text="${dataMap['name']}+' - 班级详情 - '+${infoMap['title']}"></title>
    <div data-th-replace="layout/head"></div>
    <style>
        img.e-tg-txt-pic {
            display: none;
        }
    </style>
    <link rel="stylesheet" th:href="@{{path}/common/webuploader/webuploader.css?v={v}(path=${staticPath},v=${v})}">
</head>
<body>
<input hidden id="joined" th:value="${joined}">
<input hidden id="courseId" th:value="${dataMap['courseId']}">
<input hidden id="requestUrl" th:value="${requestUrl}">
<header class="bar bar-nav">
    <a class="button button-link button-nav pull-left goBack" th:href="${backUrl}">
        <span class="iconfont icon-fanhui"></span>
    </a>
    <span th:if="${joined && dataMap['status'] == 1}">
        <a href="javascript:void(0)" class="toTopicPopBtn button button-round button-danger pull-right">
            发表话题
        </a>
    </span>
    <aside class="teacher-pic__wrap teacher-face">
        <img id="share_img" class="wm-img" th:attrappend="data-src=${dataMap['imageMap']['pcUrlMap']['small']}" th:src="@{{path}/front/mobile/v3/img/default/default-face.jpg?v={v}(path=${staticPath},v=${v})}">
    </aside>
</header>

<nav class="bar bar-tab course-info-bar-tab mfHide">
    <!--已加入-->
    <span th:if="${joined}">
        <a class="tab-item external" id="c-comment-btn" href="javascript:void(0);">
            <span class="icon iconfont icon-guanbi" style="transform: rotate(45deg)"></span>
            <span class="tab-label"> 已加入 </span>
        </a>
    </span>
    <!--未加入且未满班-->
    <span th:if="${dataMap['status'] == 1 && dataMap['full'] == 1}">
        <a class="tab-item external active" id="c-comment-btn" href="javascript:void(0);">
            <span class="icon iconfont icon-guanbi" style="transform: rotate(45deg)"></span>
            <span class="tab-label"> 加入班级 </span>
        </a>
    </span>
    <!--未加入且已满班-->
    <span th:if="${dataMap['status'] == 1 && dataMap['full'] == 2}">
        <a class="tab-item external" id="c-comment-btn" href="javascript:void(0);">
            <span class="icon iconfont icon-guanbi" style="transform: rotate(45deg)"></span>
            <span class="tab-label"> 已满员 </span>
        </a>
    </span>
    <!--已停班-->
    <span th:if="${dataMap['status'] == 2}">
        <a class="tab-item external" id="c-comment-btn" href="javascript:void(0);">
            <span class="icon iconfont icon-guanbi" style="transform: rotate(45deg)"></span>
            <span class="tab-label"> 已停班 </span>
        </a>
    </span>
    <a class="tab-item external active" id="c-share-btn" href="javascript:void(0);">
        <span class="icon iconfont icon-fenxiang"></span>
        <span class="tab-label">分享班级</span>
    </a>
</nav>

<!--主体区域 开始-->
<article>
    <div class="page-infinite__wrap teacherInfo-page__wrap">
        <div class="page-group">
            <div id="page-infinite-scroll-bottom" class="page page-current">
                <div class="content infinite-scroll native-scroll" data-type='native' data-distance="100">
                    <div class="teacher-info__wrap pr">
                        <div class="content-padded pt5 pb5 text-center">
                            <section class="teacher-face__wrap"></section>
                            <section>
                                <span class="lecture-time" id="className" th:text="${dataMap['name']}"></span>
                                <input type="hidden" id="studentCount" th:value="${dataMap['studentCount']}"/>
                            </section>
                            <section class="mt5 pt5" th:if="!${#lists.isEmpty(classesMember)}">
                                <span th:if="${sysUser['identity']} == 3" th:each="sysUser : ${classesMember}">
                                    <span class="ml5">
                                        <img class="wm-img list-block-userface vam" th:attr="data-src=${#maps.isEmpty(sysUser['member']['imageMap'])?'':sysUser['member']['imageMap']['pcUrlMap']['large']}" th:src="@{{path}/front/mobile/v3/img/default/default-face.jpg?v={v}(path=${staticPath},v=${v})}" width="30" height="30">
                                        <small class="fs4 c-888 vam" th:text="${sysUser['member']['teacherName']}"></small>
                                    </span>
                                </span>
                            </section>
                            <section class="pl5 pr5 teacher-info-txt__wrap">
                                <div class="teacher-info-box">
                                    <span class="wm-txt-small" id="classSummary" th:text="${dataMap['summary']}"></span>
                                    <span class="c-blue fs4 teacher-info-more-btn">[更多...]</span>
                                </div>
                            </section>
                            <div class="wm-attr-wrap">
                                    <span class="wm-txt-small c-bbb">学员总数：
                                        <span th:text="${dataMap['studentCount']}"></span>
                                    </span>
                                <span class="wm-txt-small c-bbb">话题总数：
                                        <span th:text="${dataMap['topicCount']}"></span>
                                    </span>
                            </div>
                            <div class="mt5 ml5 mr5 pl5 pr5">
                                <span class="button button-big button-fill button-round button-danger toTopicPopBtn" th:if="${joined}"> 发表话题 </span>
                                <span class="button button-big button-fill button-round button-danger joinClassBtn" th:if="${dataMap['status'] == 1 && !joined}"> 加入班级 </span>
                                <span class="button button-big button-fill button-round button-danger disabled" th:if="${dataMap['status'] == 2}"> 已停班 </span>
                            </div>
                        </div>
                        <section class="wm-line"></section>
                    </div>
                    <div class="wm-course-list__wrap">
                        <div class="list-block no-mt">
                            <ul class="list-container facebook-card wm-topic-list" id="topic-list"></ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</article>

<div class="popup popup-about toTopicPopup">
    <header class="bar bar-nav">
        <button class="button button-link button-nav pull-left close-popup">
            <span class="iconfont icon-guanbi ml5"></span>
        </button>
        <button id="publish-topic-btn" class="button button-link button-nav pull-right">
            <span class="mr5">发布</span>
        </button>
        <h1 class="title">发表话题</h1>
    </header>
    <div class="content">
        <div class="content-padded tqPopContent">
            <div class="list-block">
                <ul>
                    <li>
                        <div class="item-content tqPopTxtarea">
                            <div class="item-input">
                                <input id="topicTitle" type="text" placeholder="话题标题，不要超过50个字" />
                            </div>
                        </div>
                    </li>
                    <li>
                        <div class="item-content tqPopTxtarea">
                            <div class="item-input">
                                <textarea id="topicContext" placeholder="话题描述，简洁、明了，最多5000个字"></textarea>
                            </div>
                        </div>
                    </li>
                </ul>

                <ul>
                    <li>
                        <div class="item-link item-content">
                            <div class="item-inner">
                                <div class="item-title fs7">选择话题类型</div>
                                <div class="item-input">
                                    <input class="text-right" type="text" placeholder="选择话题类型" readonly id="topicType">
                                </div>
                            </div>
                        </div>
                    </li>
                </ul>

                <ul>
                    <li>
                        <div class="item-link item-content">
                            <div class="item-inner">
                                <div class="item-title fs7">话题浏览权限</div>
                                <div class="item-input">
                                    <input class="text-right" type="text" placeholder="话题浏览权限" readonly id="topicLookPermission">
                                </div>
                            </div>
                        </div>
                    </li>
                </ul>

                <ul>
                    <li>
                        <div class="item-link item-content">
                            <div class="item-inner">
                                <div class="item-title fs7">话题评论权限</div>
                                <div class="item-input">
                                    <input class="text-right" type="text" placeholder="话题评论权限" readonly id="topicReplyPermission">
                                </div>
                            </div>
                        </div>
                    </li>
                </ul>

                <ul>
                    <li>
                        <div class="item-content pt5">
                            <div class="clearfix tqImgWrap" id="tqImgWrap">
                                    <span id="def-span-box">
                                        <img id="def-question-img" th:src="@{{path}/front/web/v3/img/default/default-course.gif(path=${staticPath})}" width="auto" height="120" class="img-rounded">
                                    </span>
                            </div>
                        </div>
                    </li>
                    <li>
                        <div class="item-content pt5" >
                            <div class="item-input">
                                <div id="uploadInput" class="mobile-upload">
                                    <span class="icon icon-picture vam"></span>
                                    选择图片
                                </div>
                            </div>
                            <div class="item-after">
                                <span class="vam fs6 c-888">添加图片，最多4张</span>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>
</body>
<input type="hidden" id="classId" th:value="${dataMap['id']}">
<input type="hidden" id="topic_topicImages" />
<input type="hidden" id="topic_topicType" />
<input type="hidden" id="topic_topicLookPermission" />
<input type="hidden" id="topic_topicReplyPermission" />

<div data-th-replace="layout/footer"></div>
<script type="text/javascript" th:src="@{{path}/front/mobile/libs/zepto/deferred.js?v={v}(path=${staticPath}, v=${v})}"></script>
<script type="text/javascript" th:src="@{{path}/front/mobile/libs/zepto/callbacks.js?v={v}(path=${staticPath}, v=${v})}"></script>
<script type="text/javascript" th:src="@{{path}/common/webuploader/webuploader.min.js?v={v}(path=${staticPath}, v=${v})}"></script>
<script type="text/javascript" th:src="@{{path}/front/mobile/business/upload/mobile-upload-common.js?v={v}(path=${staticPath}, v=${v})}"></script>
<script type="text/javascript" th:src="@{{path}/front/mobile/business/class/info/class-info.js?v={v}(path=${staticPath},v=${v})}"></script>
</html>
